<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>充值记录</title>
		<link rel="stylesheet" href="../css/body.css" />
		<link rel="stylesheet" href="../css/bootstrap.css" />
		<script type="text/javascript" src="../js/jquery-3.2.1.js"></script>
		<script type="text/javascript" src="../js/bootstrap.js"></script>
		<script type="text/javascript" src="../js/getPath.js" ></script>
	</head>
	<style>
		.container{
			margin-left: 200px;
			margin-top: 30px;
		}
		tr,
		th{
			text-align: center;
		}
	</style>
	<body>
		<div class="container">
			<div class="row clearfix">
				<div class="col-md-10 column">
					<table class="table table-hover table-bordered">
						<thead>
							<tr class="active">
								<th>姓名</th>
								<th>充值金额</th>
								<th>充值日期</th>
							</tr>
						</thead>
						<tbody id="tbody">
							
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</body>
	<script>
		$(function(){
			$.ajax({
				type:"post",
				data: ({
					"method":"rechargeQuery",
				}),
				url: getPath() + "/recharge",
				dataType: "json",
				success: function(jsonData){
					$(jsonData.data).each(function(index,value){
						var tr = $('<tr class="info"></tr>');
						var userName = $('<td>' + value.userName + '</td>');
						var rechargeMoney = $('<td type="money">' + value.rechargeMoney + '</td>');
						var rechargeTime = $('<td>' + value.rechargeTime + '</td>');
						
						tr.append(userName);
						tr.append(rechargeMoney);
						tr.append(rechargeTime);
						
						$('#tbody').append(tr);
					});
					var list = $('td[type="money"]');
					var tr = $('<tr class="danger"></tr>');
					var td = $('<td style="text-align: center;" colspan="3">总金额：</td>');
					var sunMoney = 0;
					list.each(function(index,data){
						sunMoney = parseInt(sunMoney) + parseInt($(data).text());
					});
					td.append(sunMoney);
					tr.append(td);
					$('#tbody').append(tr);
				}
			});
		});
	</script>
</html>
